<div class="special-products">
<h3 class="box-title">{{ heading_title }}</h3>
<div class="product-list row">
  {% for product in products %}
  <div class="product-wrap col-lg-3 col-md-3 col-sm-6 col-xs-6">
    <div class="product-item">
      <div class="product-img">
        <div class="image">
          <a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a>
        </div>
        <div class="action">
          <button type="button" data-toggle="tooltip" title="{{ button_cart }}" onclick="cart.add('{{ product.product_id }}');"><i class="icon-cart"></i></button>
          <button type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="icon-heart"></i></button>
          <button type="button" data-toggle="tooltip" title="{{ button_compare }}" onclick="compare.add('{{ product.product_id }}');"><i class="icon-swap"></i></button>
        </div>
      </div>
      <div class="product-info">
        <h4 class="title"><a href="{{ product.href }}">{{ product.name }}</a></h4>
        {% if product.price %}
        <p class="price">
          {% if not product.special %}
          {{ product.price }}
          {% else %}
          <span class="price-new">{{ product.special }}</span>
          <span class="price-old">{{ product.price }}</span>
          {% endif %}
        </p>
        {% endif %}
      </div>
    </div>
  </div>
  {% endfor %}
</div>
</div>
